<!--
  描述：详情公共组件结构Html
  公司：xxx有限公司
  版权：xxx2020
  作者：oyjl
  时间：2020-04-27 09:08:51
  -->
<div class="main">
  <div class="top">
    <i class="pi pi-chevron-left" (click)="goBack();" title="返回上一页"></i>
    <span [ngStyle]="detail.headStyle">{{detail.head}}</span>
    <i class="pi pi-home" (click)="goHome()" title="返回首页"></i>
  </div>
  <!-- 头部 -->
  <div class="head margin-between-8 " *ngIf="detail.moduleHead">
    <span>{{detail.moduleHead.text}}</span>：
    <span>{{data && data[detail.moduleHead.orderNum]}}</span>
    <span *ngIf="detail.moduleHead.status">【{{(data &&
      data[detail.moduleHead.status])|dict:detail.moduleHead.dict}}】</span>
  </div>
  <div #content class="content">
    <ng-container *ngFor="let item of detail.modules">
      <div class="fragment" *ngIf="item.type === 'text'">
        <!-- 头部 -->
        <div class="head">
          <span>{{item.head}}</span>
        </div>
        <!-- 主体 -->
        <div class="content" *ngFor="let element of item.fields">
          <p>
            <span>{{element.text}}</span>：<span>{{getInnerValue(item.data || data, element.field)}}</span>
          </p>
        </div>
      </div>
      <div class="fragment" *ngIf="item.type === 'table'">
        <!-- 头部 -->
        <div class="head">
          <span>{{item.head}}</span>
          <ng-container *ngIf="item.headTotal && item.headTotal.length > 0">
            <ng-container *ngFor="let ele of item.headTotal">
              <div [ngStyle]="ele.style">
                <span>{{ele.text}}</span>：
                <span *ngIf="!ele.dictKey">{{totalHandle((item.data || (data && data.list)),
                  ele.fields)|dict:ele.dict}}</span>
                <span *ngIf="ele.dictKey === 'date'">{{totalHandle((item.data || (data && data.list)),
                  ele.fields)|date:ele.dict}}</span>
                <span *ngIf="ele.dictKey === 'currency'">{{totalHandle((item.data || (data &&
                  data.list)), ele.fields)|currency:'CNY':'symbol-narrow':'1.2'}}</span>
              </div>
            </ng-container>
          </ng-container>
        </div>
        <!-- 主体 -->
        <div class="content">
          <table>
            <tr *ngFor="let row of (item.data || (data && data.list));let i = index;">
              <td class="index" *ngIf="item.isIndex">{{i + 1}}</td>
              <td>
                <p *ngFor="let element of item.fields">
                  <span [ngStyle]="element.testStyle">{{element.text}}</span>：
                  <span [ngStyle]="element.fieldStyle" *ngIf="!element.dictKey">{{getInnerValue(row,
                    element.field)|dict:element.dict}}</span>
                  <span [ngStyle]="element.fieldStyle" *ngIf="element.dictKey === 'date'">{{getInnerValue(row,
                    element.field)|date:element.dict}}</span>
                  <span [ngStyle]="element.fieldStyle" *ngIf="element.dictKey === 'currency'">{{getInnerValue(row,
                    element.field)|currency:'CNY':'symbol-narrow':'1.2'}}</span>
                </p>
              </td>
              <td *ngIf="item.isFind"><a href="javascript:void(0)"
                  (click)="detailHandle(item.jumpUrl, row[item.id])">查看></a></td>
            </tr>
          </table>
        </div>
      </div>
    </ng-container>
  </div>
  <div class="button-groups" *ngIf="detail.buttons">
    <ng-container *ngFor="let item of (detail.buttons || [])">
      <button pButton type="button" label="{{item.text}}" (click)="buttonHandle(item.dialog)"></button>
    </ng-container>
  </div>
</div>
<app-loading [(showLoading)]="showLoading"></app-loading>
<app-dialog [commonDialog]="commonDialog" [(showDialog)]="showDialog"></app-dialog>
<app-confirm-dialog></app-confirm-dialog>
